<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0,
           maximum-scale=1.0, minimum-scale=1.0"/>
    <title>angular练习--书写请求与过滤循环</title>

</head>
<body>
    <div ng-app="myApp">
        <div ng-controller="personController">
            <!--此处的model相当与一个value的默认值了-->
            <p>姓名：<input type="text" ng-model="first"/></p>
            {{first | uppercase}}
            {{last |lowercase}}
        </div>

        <div ng-controller="costController">
            数量：<input type="number" ng-model="quantity"/>
            价格：<input type="number" ng-model="price"/>
            {{(quantity*price)| currency:'¥' }}
        </div>

        <div ng-controller="secondController">
            <!--<p>在输入框中的输入：</p>-->
            <!--<p>姓名：<input type="text" ng-model="first"/></p>-->
            <input type="text" ng-model="num"/>
            {{person[0].name}}{{person[0].age}}
            <!--循环取数组中的数据-->
            <ul>
                <!-- 循环过程中可以排序,注意写法-->
                <!-- 循环过程中可以输入过过滤（filter），注意写法，是根据输入的字符来过滤的-->
                <li ng-repeat="p in person | filter:num  | orderBy:'age'">
                    {{p.name}} 年龄:{{p.age}}
                </li>
            </ul>
        </div>
    </div>
</body>
<script src="js/angular.js"></script>
<script type="text/javascript">
    // 获取angular对象通过对象，操作controller
    var app= angular.module("myApp",[]);
    app.controller('personController', function ($scope,$http) {
        $http.get('url').success(function (data,stutas,heades,config) {

        }).error(function () {

        })

        $scope.first="aa";
        $scope.last="ABC";
    })

    app.controller('costController', function ($scope) {
    //如果采用了ng-controller 此处必须要做下这个操作，否则这会报错,
    })

    /*排序*/
    app.controller('secondController', function ($scope) {
        $scope.person=[{name:'zhang',age:25},
                        {name:'li',age:24},
                        {name:'liu',age:23},
                        {name:'wang',age:25}];
    })

</script>
</html>